﻿<!DOCTYPE html>
<html>

	<head>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>查询结果图表展示</title>
		<link rel="stylesheet" type="text/css" href="../css/home.css" />
		<link rel="stylesheet" type="text/css" href="../css/loading.css"/>
		<link rel="stylesheet" type="text/css" href="../css/fontawesome/css/font-awesome.css" />
		<link rel="stylesheet" type="text/css" href="../css/weui.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/jquery-weui.min.css" />
		<link rel="stylesheet" type="text/css" href="../css.page/statistics/statisticsChartTotal.css" />
	</head>

	<body>
		<div class="statistics-chart-selectPage">
			<div class="statistics-chart-title">
				<div class="fa fa-angle-left iconBack" @click="backTotal"></div>
				<div class="title">选择查询周期</div>
			</div>
			<div class="statistics-chart-date">
				<div>
					<div class="fa fa-calendar icon"></div>
					<div>查询年份：</div>
					<div class="week" style="margin-left: 5px;">
						<input id="yearDate" type="text" placeholder="请选择需查询日期">
					</div>
				</div>
				<div>
					<div class="fa fa-calendar icon"></div>
					<div>查询月份：</div>
					<div class="week" style="margin-left: 5px;">
						<input id="dateDate" type="text" placeholder="请选择需查询日期">
					</div>
				</div>
			</div>
			<div class="statistics-chart-btn" @click="searchCycle">
				查&nbsp;&nbsp;&nbsp;询
			</div>
		</div>
		<div class="loader">
			<div class="dot"></div>
			<div class="dot"></div>
			<div class="dot"></div>
			<div class="dot"></div>
			<div class="dot"></div>
		</div>
		<div class="statistics-chart-body hidden">
			<div class="statistics-chart-title">
				<div class="fa fa-angle-left iconBack"></div>
				<div class="title">趋势查询</div>
			</div>
			<div class="statistics-chart-info" v-if="!isSearch">
				<div class="infoTitle">
					当前周期：{{selectYear}}年{{selectMonth}}月
				</div>
				<div class="selectBtn">筛选</div>
			</div>
			<div class="statistics-chart-tab">
				<div style="margin-left:0;" class="active" @click="guanCangChart">馆藏总量</div>
				<div @click="gongYeChart">长输工业管线</div>
				<div @click="shiZhengChart">市政管线</div>
				<div @click="chanZhiChart">测绘产值</div>
			</div>
			
			<!--馆藏总量数据图-->
			<div class="guancang hidden" v-show="chartTab==1">
				<div class="statistics-chart-cTitle">馆藏总量年对比图</div>
				<div class="statistics-chart" id="guanCangRoundChart"></div>
				
			    <div class="statistics-chart-cTitle">馆藏总量年趋势图</div>
				<div class="statistics-chart" id="guanCangLineChart"></div>
			</div>
			
			<!--长输工业管线数据图-->
			<div class="gongye hidden" v-show="chartTab==2">
				<div class="statistics-chart-cTitle">长输工业管线年对比图</div>
				<div class="statistics-chart" id="gongYeRoundChart"></div>
				
			    <div class="statistics-chart-cTitle">长输工业管线年趋势图</div>
				<div class="statistics-chart" id="gongYeLineChart"></div>
			</div>
			
			<!--市政管线数据图-->
			<div class="shizheng hidden" v-show="chartTab==3">
				<div class="statistics-chart-cTitle">市政管线年对比图</div>
				<div class="statistics-chart" id="shiZhengRoundChart"></div>
				
			    <div class="statistics-chart-cTitle">市政管线年趋势图</div>
				<div class="statistics-chart" id="shiZhengLineChart"></div>
			</div>
			
			<!--测绘产值数据图-->
			<div  class="chanzhi hidden" v-show="chartTab==4">
				<div class="statistics-chart-cTitle">测绘产值年对比图</div>
				<div class="statistics-chart" id="chanZhiRoundChart"></div>
				
				<div class="statistics-chart-cTitle">测绘产值年趋势图</div>
				<div class="statistics-chart" id="chanZhiLineChart"></div>
			</div>
		</div>

		<script src="../js/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/fastclick.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/base64.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/jquery-weui.min.js" type="text/javascript" charset="utf-8"></script>
		<!--引入hightcharts-->
		<script src="../js/hightcharts/highcharts.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/hightcharts/data.js" type="text/javascript" charset="utf-8"></script>
		
		<script src="../js/calender.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js.page/statistics/statisticsChartTotal.js" type="text/javascript" charset="utf-8"></script>
	</body>

</html>